<template>
  <div>
    <!-- 创建查询条件 -->
    <TopFilter ref="formPanel" :list="topFilterList" :cols="4" :collapse="true" @filterChange="changeHandle"></TopFilter>
    <!-- 创建一个查询table -->
    <FilterTable
      ref="table"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'rows'"
      :columns="columns"
      :onColumnsChange="columns => (this.columns = columns)"
      :isExportExcel="true"
      exportFileName="维修回访效率统计报表.xlsx"
    >
      <!-- <template slot="controls">
        <el-button size="small" type="primary" icon="el-icon-download" :loading="exportLoading" @click="exportData()">导出</el-button>
      </template> -->
    </FilterTable>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getRepairVisitEfficiency, exportRepairVisitEfficiency } from '@/api/customerRepair/visitAnalysis/repairVisitEfficiency';
import { getAllUser } from '@/api/customerRepair/usedCarVisit/resultEntry';
import { exportExcelFile, arrayObjDeWeight } from '@/utils/index';

export default {
  mixins: [dictionary],
  // 组件注册
  // components: {
  //   RtmAlarmDetail,
  //   EditAlarmDetail
  // },
  // 绑定数据定义
  data() {
    this.BaseTable = null;
    return {
      topFilterList: this.createTopFilterList(),
      fetchApi: getRepairVisitEfficiency,
      fetchParams: {},
      columns: this.createColumns(),
      type: null,
      exportLoading: false
    };
  },
  created() {},
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
    this.getAllUser();
  },

  // 处理方法
  methods: {
    // 关闭页面触发事件
    // 创建查询条件
    createTopFilterList() {
      return [
        {
          type: 'RANGE_DATE',
          label: '日期范围',
          style: { minWidth: '200px' },
          fieldName: 'inputDateS|inputDateE',
          valueFormat: 'yyyy-MM-dd'
        }
      ];
    },
    createColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '回访时间',
          dataIndex: 'INPUT_DATE',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'date-range',
          dateFormat: 'yyyy-MM-dd HH:mm:SS'
        },
        {
          title: '服务顾问姓名',
          dataIndex: 'TRANCER',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: [],
          editType: 'select',
          editable: false,
          editItems: []
        },
        {
          title: '需回访单数',
          dataIndex: 'NEED_COUNTS',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '已回访单数',
          dataIndex: 'USED_AMOUNT',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '已回访次数',
          dataIndex: 'USED_COUNTS',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '电话已接通量',
          dataIndex: 'CONNECTED_COUNTS',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '电话未接通量',
          dataIndex: 'NOWHERE_COUNTS',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '回访成功量',
          dataIndex: 'SUCCESS_COUNTS',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '已回访单满意度平均得分',
          dataIndex: 'AVERAGE_SCORE',
          width: 200,
          sorter: true,
          filter: true,
          filterType: 'number'
        },
        {
          title: '回访成功率',
          dataIndex: 'SUCCESS_RATE',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '电话接通率',
          dataIndex: 'PHONE_SUCCESS_RATE',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '电话未接通率',
          dataIndex: 'PHONE_FAIL_RATE',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    // 查询条件触发方法
    changeHandle(val) {
      this.fetchParams = Object.assign({}, val, { xhrAbort: false });
    },
    // 所有用户
    async getAllUser() {
      const res = await getAllUser();
      let data = arrayObjDeWeight(res.data, 'userId'); // 人员去重(解决前端报错)
      this.columns.find(x => x.dataIndex === 'TRANCER').filterItems = this.columns.find(item => item.dataIndex === 'TRANCER').editItems = data.map(x => ({
        value: x.userId + '',
        text: x.employeeName
      }));
    },
    // 导出
    exportData() {
      this.exportLoading = true;
      exportRepairVisitEfficiency(this.fetchParams).then(res => {
        exportExcelFile(res, '维修回访效率报表');
      });
      this.exportLoading = false;
    }
  }
};
</script>
